import React from 'react'

export default props => {
  const {theme = {color: '#fff', backgroundColor: '#000'}, onChange} = props

  const change = (e, type) => {
    let val = e.target.value;
    let newTheme = JSON.parse(JSON.stringify(theme))
    newTheme[type] = val
    console.log(val, type);
    onChange(newTheme)
  }
  return (
    <div>
      <span>前景色</span>
      <input type="color" value={theme.color} onChange={e => change(e, 'color')} />
      <span>背景色</span>
      <input type="color" value={theme.backgroundColor} onChange={e => change(e, 'backgroundColor')}/>
    </div>
  )
}